// 基础地址
const BASE_URL = 'http://110.41.43.118:3008';
// 登录状态
const USERNAME = localStorage.getItem('username');
const TOKEN = localStorage.getItem('token');

// 获取元素
let oWelcome = document.querySelector('.welcome');
let oLoginout = document.querySelector('.loginout');
let oLogin = document.querySelector('.login');
let oRegister = document.querySelector('.register');

let oCartList = document.querySelector('.cart-list');
let oCartMsg = document.querySelector('.cart-msg');
let oCartBtn = document.querySelector('.cart-btn');

// 验证登录状态
(function(){
	
	// 封装交互状态
	function loginStatusRender(welStatus, loginoutStatus, txt){
		oWelcome.style.display = welStatus;
		oWelcome.innerHTML = `欢迎，${txt}`;
		oLoginout.style.display = welStatus;
		
		oLogin.style.display = loginoutStatus;
		oRegister.style.display = loginoutStatus;
	};
	
	if(USERNAME && TOKEN){
		loginStatusRender('block', 'none', USERNAME);
		
		// 调用获取购物车数据方法
		getCartValue();
		
	}else{
		loginStatusRender('none', 'block', '');
	};
	
	//点击退出按钮
	oLoginout.onclick = function(){
		// 清除本地存储
		localStorage.removeItem('username');
		localStorage.removeItem('token');
		// 交互
		loginStatusRender('none', 'block', '');
		// 显示暂无购物车
		oCartMsg.style.display = 'block';
		oCartList.style.display = 'none';
		// 交互文本
		oCartBtn.innerHTML = '快去抢购物良仓商品吧！';
		oCartBtn.onclick = null;
		
	};
	
	
	
	//点击登录按钮
	oLogin.onclick = function(){
		let goodsId = wj.getUrlValue('goodsId');
		let catId = wj.getUrlValue('catId');
		// 带参数的跳转
		location.href = goodsId ? `login.html?goodsId=${goodsId}&catId=${catId}` : 'login.html';
	};
	
})();

// 封装购物车方法
function getCartValue(){
	
	// 交互文本
	oCartBtn.innerHTML = '查看购物车';
	oCartBtn.onclick = function(){location.href = 'cart.html'};
	
	wj.ajax({
		method: 'post',
		url: BASE_URL + '/api_cart',
		data: {userId: TOKEN, status: 'viewcart'},
		success(res){
			console.log(res);	
			if(res.code != 0){
				console.log(res);
				return;
			};
			
			//购物车验证
			let cartCount = res.data.length;
			if(cartCount == 0){
				// 显示暂无购物车
				oCartMsg.style.display = 'block';
				oCartList.style.display = 'none';
				return;
			};
			
			//购物车有商品
			oCartMsg.style.display = 'none';
			oCartList.style.display = 'block';
			
			//DOM组装
			let str = '';
			res.data.forEach(item => {
				str += `
					<li class="goods">
						<a href="product.html?goodsId=${item.goods_id}&catId=${item.cat_id}"><img src="${item.goods_thumb}" alt="" /></a>
						<div>
							<p>${item.goods_name}</p>
							<p>服装尺码:S;颜色:米白/黑;</p>
							<p>
								<span>数量：${item.goods_number}件</span>
								<span>¥${parseInt(item.price * 0.9)}.00</span>
								<span>¥${item.price}.00</span>
							</p>
						</div>
					</li>
				`;
			});
			
			// 添加到页面
			oCartList.innerHTML = str;
		}
	})
};


// 数据
const CAT_DATA = [
	{cat_id: '0045', cat_name: '家居'},
	{cat_id: '0077', cat_name: '玩乐'},
	{cat_id: '0082', cat_name: '餐厨'},
	{cat_id: '0092', cat_name: '美食'},
	{cat_id: '0062', cat_name: '文具'},
	{cat_id: '0069', cat_name: '数码'},
	{cat_id: '0141', cat_name: '配饰'},
	{cat_id: '0154', cat_name: '美护'},
	{cat_id: '0166', cat_name: '出行'},
	{cat_id: '0182', cat_name: '图书'},
	{cat_id: '0214', cat_name: '艺术'},
	{cat_id: '0279', cat_name: '水具'},
	{cat_id: '0358', cat_name: '运动'},
	{cat_id: '0112', cat_name: '服装'},
	{cat_id: '0129', cat_name: '鞋包'},
];


//分类导航业务
(function(){
	
	// 获取元素
	let oNavList = document.querySelector('.nav-list');

	// 页面打开就请求 商品分类导航 的数据
	wj.ajax({
		url : BASE_URL + '/api_cat',
		success(res){
			// console.log(res.data);
			
			// 验证请求结果
			if(res.code != 0){
				console.log(res);
				return;
			};
			
			//想要的结果
			let data = res.data;
			
			//遍历操作
			let str = '';
			data.forEach(item => {
				// 累加数据
				str += `
					<li cat-id="${item.cat_id}">
						<a href="classify.html?catId=${item.cat_id}&catName=${item.cat_name}" target="_blank">
							<img src="${item.cat_img}" alt="" />
							<p>${item.cat_name}</p>
						</a>
					</li>
				`;
			});
			// console.log(str);
			// 添加到对应的结构
			oNavList.innerHTML = str;
			
			//获取小分类的数据
			wj.ajax({
				url : BASE_URL + '/api_classify',
				success(res){
					
					let classifyAll = res.data;
					
					
					// 子菜单交互  封装
					let aLi = document.querySelectorAll('.nav-subnav .nav-list>li');
					// console.log(aLi);
					// 批量监听事件
					// 鼠标移入
					aLi.forEach(item => {
						// 鼠标移入
						item.onmouseenter = function(){
							let okArr = classifyAll.filter(item => {
								return item.cat_id == this.getAttribute('cat-id')
							})
							
							okArr[0].data.forEach(item => {
								// console.log(item.product_content);
							});
							
						}
					})
					
					
				}
			})
			
			
		}
	});
	
	
	

})();

// 返回顶部
(function(){
	let oBackTop = document.querySelector('.back-top');
	
	// 监听页面卷动事件
	document.onscroll = function(){
		//验证滚动出去的值
		let scrollTop = document.documentElement.scrollTop;
		let isShow = scrollTop >= 400 ? 'block' : 'none';
		oBackTop.style.display = isShow;
	};
	
	// 点击事件
	oBackTop.onclick = function(){
		// 返回顶部，设置scrollTop
		// document.documentElement.scrollTop = 0;
		
		// let scrollTop = document.documentElement.scrollTop;
		
		// window.scrollTo({top: 0, behavior: 'smooth'});
		
		// 设置到滚动出去的值 x  y
		// window.scrollTo(0, 220);
		
		// option: {left|top, 是否动画形式}
		window.scrollTo({top: 0, behavior: 'smooth'});
		
		
		// let timer = setInterval(() => {
		// 	//累减
		// 	scrollTop -= 100;
		// 	//验证
		// 	if(scrollTop <= 0){
		// 		//停止定时器
		// 		clearInterval(timer);
		// 		// 拉回终点
		// 		scrollTop = 0;
		// 	};
		// 	// 设置
		// 	document.documentElement.scrollTop = scrollTop;
			
		// }, 10);
		
	};
	
})();





